import Vue from 'vue'
import { Lazyload, Swipe, SwipeItem,Image } from 'vant'
import BScroll from '@better-scroll/core'
import NestedScroll from '@better-scroll/nested-scroll'
import headss from '../../components/header/index.vue'
import popus from '../../components/popu/index.vue'
import masktos from '../../components/mask/index.vue'
import { getLunbo,getinfo,getuser } from '../../api/shouye.js'
BScroll.use(NestedScroll)
Vue.use(Lazyload)
// Vue.use(VanImage)
export default {
  name: 'shouye',
  data () {
    return {
      images: [
        'https://lanhu.oss-cn-beijing.aliyuncs.com/psg5ishnpydoxm35u2g73vg044ydciyh7cse5b704f5-a85e-446e-806c-d20c9c7aeb6a',
        'https://lanhu.oss-cn-beijing.aliyuncs.com/psg5ishnpydoxm35u2g73vg044ydciyh7cse5b704f5-a85e-446e-806c-d20c9c7aeb6a'
      ],	
      popus:false,	
      swiperOption: {
        direction: 'vertical',
        slidesPerView: 'auto',
        freeMode: true,
        scrollbar: {
          el: '.swiper-scrollbar'
        },
        mousewheel: true
      },
      swiperOptions: {
        slidesPerView: 'auto',
        // centeredSlides: true,
        touchMoveStopPropagation :true,
        // spaceBetween: 10,
        pagination: {
          el: '.swiper-pagination',
          clickable: true
        }
      },
      loopData: [{
        image: 'https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/61a8af0c1f655f0011bb51f4/61c94cba1158630011a4e26c/16405835341666021602.png',
        name: '我要寄养'
      }, {
        image: 'https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/61a8af0c1f655f0011bb51f4/61c94cba1158630011a4e26c/16405835343937033714.png',
        name: '宠物美容'
      }, {
        image: 'https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/61a8af0c1f655f0011bb51f4/61c94cba1158630011a4e26c/16405835342752494423.png',
        name: '宠物医疗'
      }, {
        image: 'https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/61a8af0c1f655f0011bb51f4/61c94cba1158630011a4e26c/16405835345246550767.png',
        name: '知识百科'
      }],
      Nueselist:[{
        id:1
      },{
        id:2
      },{
        id:3
      },{
        id:4
      },{
        id:5
      }],
      scroll:0,
      info:[]
    }
  },
  components: {
    [Swipe.name]: Swipe,
    'vanImage': Image,
    [SwipeItem.name]: SwipeItem,
    headss,
    popus,
    masktos
  },
  mounted() {
    this.init()
    this.getload()
    // 监听路由
    window.addEventListener(
      "popstate",
      () => {
        if (this.popus) {
          this.popus = false;
        }
      },
      false
    );
     //监听事件
     window.onresize = ()=>{
      return(()=>{
        that.bs.refresh()
    })()
    }
  },
  activated(){
    console.log('我进来了')
    // alert(this.scroll,'大傻逼')
     this.bs.refresh()
    this.bs.scrollTo(0,this.scroll, 0)
    // this.bs.refresh()
  },
  deactivated(){
    console.log(this.bs.y)
    this.scroll = this.bs.y
    console.log('我离开了')
  },
  beforeDestroy() {   
    this.bs.destroy()
  },
  methods: {
    loadimg(){
      this.bs.refresh()
      this.bstwo.refresh()
    },
    init() {  
      this.bs = new BScroll(this.$refs.scroll, {
        probeType: 1,
        click: true
      })
      this.bstwo = new BScroll(this.$refs.scrolls, {
        scrollX: true,
        // probeType: 1 // listening scroll event
      })
      // this.bs.on('scrollStart', () => {
      //   console.log('scrollStart-')
      // })
      // this.bs.on('scroll', ({ y }) => {
      //   console.log('scrolling-')
      // })
      // this.bs.on('scrollEnd', (pos) => {
      //   console.log(pos)
      // }) 
    },
    // 获取数据接口
    getload(){
      // 获取轮播图数据
      getLunbo().then(res => {
        console.log(res,'傻逼')
        this.images = res.data
      })
      // 获取用户信息
      getinfo().then(res => {
        console.log(res,'傻逼')
        this.info = res.data
      })
      // 获取医生详情信息
      getuser().then(res => {
        console.log(res,'傻逼')
        this.Nueselist = res.data
      })
    },
    // 打开弹出层
    popu(){
      // 添加一级空白路由
      window.history.pushState(null, null, "#");
      this.popus = true
    },
    // 监听回调
    ss(){
      this.$router.go(-1)
      this.popus = false
    },
    closes(){
      this.$router.go(-1)
      this.popus = false
    },
    golist(index){
      console.log(index,'哈哈')
      if(index == 0){
        this.$router.push({
          name:'foster'
        })
      } else if(index == 1){
        this.$router.push({
          name:'cosmetology'
        })      
      }
      else if(index == 2){
        this.$router.push({
          name:'medicalCare'
        })      
      }  else if(index == 3){
        this.$router.push({
          name:'Encyclopedias'
        })      
      }         
    }
  }
}
